<!DOCTYPE html PUBLIC"-//W3C//DTDXHTML1.0Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <link href="header.css" type="text/css" rel="stylesheet" />
        <link type="text/css" href="index.css" rel="stylesheet" />
        <script src="./js/jquery.js" type="text/javascript" ></script>
        <script src="./js/xheditor/xheditor-zh-cn.min.js?v=1.1.3" type="text/javascript" ></script>
        <script type="text/javascript">
            $(document).ready(function(){
                    $(".reply").click(function(){///回复
                        $("#elm1").focus();
                        var name =  $(this).parents(".subitem").find(".id").text();
                        $("#elm1").val('<div style="border:1px solid black">To '+name+":</div><br/><br/>");
                        });
                    $(".reference").click(function(){//引用
                        $("#elm1").focus();
                        var t = $(this).parents(".right").find(".right-content").text();
                        var name =  $(this).parents(".subitem").find(".id").text();
                        $("#elm1").val("引用自"+name+':<div style= "border:1px solid black" >'+t+"</div><br/><br/>");
                        });
                    $(".main-item a").eq(0).click(function(){ // 新话题
                        });
                    $(".main-item a").eq(1).click(function(){  // 回复
                        $($this).parents(".elm1").focus();
                        });
                    } );

                </script>
                <style type="text/css">
                    .left, .right{
                        border:1px solid black;
                        margin-bottom:1px;
                    }
                    .left{
                        border-right:none;
                        width:20%;
                        height:10em;
                        float:left;
                    }
                    .right{
                        float:left;
                        height:10em;
                        width:79%;
                    }
                    .right-head{
                        border-bottom:1px solid black;
                        height:20%;
                    }
                    .right-content{
                        height:80%;
                    }
                    .left li{
                        line-height:1em;
                        list-style:none;
                    }
                    .left .img{
                        width:90%;
                        height:30px;
                        overflow:hidden;
                    }
                    .left  label{
                        display:block;
                        float:left;
                        width:5em;
                    }
                    .right-head  li{
                        list-style:none;
                        margin-left:1em;
                    }
                    .right-head .head-left{
                        float:left;
                    }
                    .right-head .head-right{
                        float:right;
                    }

                    .right-head ul{
                        margin:0;
                        padding:0;
                    }
                </style>
            </head>
            <body>
                <div id="wrapper">
                    <div id="header">
                        <div id="topbar">
                            <ul>
                                <li id="login"><a href="#">登陆</a></li>
                                <li id="signup"><a href="#">注册</a></li>
                            </ul>    
                        </div>
                        <div id="logo">
                        </div>
                        <p id="tittle">xxxxxxx</p>

                    </div>
                    <br class="clear"/>
                    <div id="content">
                        <div class="navs">
                            <ul >
                                <li><a href="#edit">[发表新话题] </a>
                                </li><li> <a href="#edit">[回复]</a>
                                </li>
                                <li ><a href="#">root</a>></li>                
                            </ul>
                            <!-- 定义一top锚点-->
                            <a name="top"></a>
                        </div> 
                        <br class="clear"/>
                        <div class="subitem">
                            <div class="left">
                                <ul>
                                    <li class="id">abc</li>
                                    <li><div class="img"><img src="1.jpg"/></div></li>
                                    <li class="group">admin</li>
                                    <li class="topics"><label>主题</label><a href="#">22</a></li>
                                    <li class="online-time"><label>在线时间</label>333小时</li>
                                    <li class="status"><label>状态</label>在线</li>
                                </ul>
                            </div>
                            <div class="right">
                                <div class="right-head">
                                    <ul>
                                        <li class="head-left">1楼</li>
                                        <li class="head-left">发表于 2008-12-30 17:15</li>
                                        <li class="head-left">|<a href="#">只看作者</a></li>
                                        <li class="head-right"><a href="#top">top</a></li>
                                        <li class="head-right"><a class="reply" href="#edit">[回复]</a></li>
                                        <li class="head-right reference"><a href="#edit">[引用]</a></li>
                                    </ul>
                                </div>
                                <div class="right-content">
                                    sadfasfsda
                                    sadfsadf
                                    sdafsaf
                                    sadfasf
                                    sadf
                                </div>
                            </div>

                            <br class="clear"/>
                        </div>

                    </div>
                    <br class="clear"/>

                    <form id="editor" method="post">
                        <a name="edit"></a>
                        <p>回复主题</p>
                        <textarea id="elm1" name="elm1" class="xheditor" rows="12" cols="80" style="width: 100%">
                        </textarea><br />
                        <input type="submit" value="Submit" name="save"/>
                        <input type="reset" value="Reset" name="reset">
                    </form>
                    <br class="clear"/>
                    <div id="foot">
                        <p>copyright 2010</p>
                    </div>
                </div>
            </body>
        </html>
